import { h, render } from 'vue'
import type { App } from 'vue'
import loading from './loading.vue'

type Options = {
	color?: string
}

export default {
	install(app: App, options: Options) {
		// 公共属性
		app.config.globalProperties.$A = '自定义全局属性'

		// provide
		app.provide('msg', '这是provide的数据')

		// 注册全局组件
		// app.component('name',com)

		// TODO 注册自定义组件
		// 转以为VNode，并传递配置属性。组件除了使用props接的属性，其他挂载到节点上为自定义属性
		const custom = h(loading, { color: options?.color, A: '组件上的自定义属性' })
		// 挂载到指定节点
		render(custom, document.body)
		// 挂载组件方法到全局使用
		app.config.globalProperties.$$loading = {
			show: custom.component?.exposed?.show,
			hide: custom.component?.exposed?.hide,
		}
	},
}
